import QtQuick
import QtQuick.Controls
import QtQuick.Controls.Basic
import QtQuick.Layouts

// TextField - Style2
Rectangle {
    Layout.fillWidth: true
    Layout.fillHeight: true

    TextField {
        id: styledTextField
        width: 250
        height: 40
        anchors.centerIn: parent
        placeholderText: "带图标的文本框"

        // 背景样式
        background: Rectangle {
            implicitWidth: 250
            implicitHeight: 40
            color: styledTextField.enabled ? "white" : "#f5f5f5"
            border.color: styledTextField.activeFocus ? "#21be2b" :
                          styledTextField.hovered ? "#808080" : "#c0c0c0"
            border.width: styledTextField.activeFocus ? 2 : 1
            radius: 8
        }

        Image {
            source: "/icons/search2.png"
            anchors.left: parent.left
            anchors.leftMargin: 8
            anchors.topMargin: 8
            anchors.verticalCenter: parent.verticalCenter
            width: 24
            height: 24
        }

        // 文本样式
        color: "black"
        selectionColor: "#21be2b"
        selectedTextColor: "white"
        font.pixelSize: 14
        leftPadding: 40
        rightPadding: 10
        topPadding: 10
    }
}
